$(document).ready(function() {
    var userId = sessionStorage.getItem('userId');
    console.log(userId);
        var vm = new Vue({
            el: "body",
            data: {
                //默认加载筛选条件存放容器
                "IP":'39.107.58.193:8080',
                "boardName":"近日-销售看板",
                "dataContainer":{},//当常用看板打开时，用于从url中获取筛选条件
                "selecShow":true,
                "backURL":'../manageBoard/',
                "year_month": [],//年份
                "pay_modal": [],//支付方式
                "opera_modal": [],//运营模式
                "pro_source": [],//产品来源
                "spike": [],//通路
                //"year":[],//年份
                //"month":["01","02","03","04","05","06","07","08","09","10","11","12"],//月份
                "provCity": [],//省市
                "skuAll": [],//所有的sku信息

                "provIdcity": [],//省对应的城市-//选中的省对应的城市列表列表信息
                "proName": "",//点击的省份名称
                "proId": "",//点击的省的id

                "getYear": '',//选中的日期
                "getMonth": '',//选中的月份
                "getPayItem": [],//选中的支付方式
                "getOperaItem": [],//选中的运营模式
                "getProSourceItem": [],//选中的产品来源

                "getProviceId": [],//选中的省份ID
                "getProviceLabel": [],//选中的省份label
                "getProviceStr": "",//选中的身份字符串

                "getAllCities": [],//获取所有的城市信息
                "getCityId": [],//选中的城市ID
                "getCityLabel": [],//选中的城市label
                "getCityStr": "",//选中的城市字符串

                "getSpikeId": [],//选中的通路ID
                "getSpikeLabel": [],//选中的通路label
                "getSpikeStr": "",//选中的通路字符串

                "getSkuId": [],//选中的sku信息
                "getSkuStr": "",//选中的sku字符串
                "getSkuLabel": [],//选中的skulabel


                "getCityPoint": [],//选择的城市下对应的点位
                "getPointId": [],//选中的点位ID
                "getPointStr": [],//选中的点位字符串
                "getPointLabel": [],//选中的点位label

                "modelSelect": {
                    "model": "recent_sales_board",
                    "condition": {
                        "year_month": "",
                        "pay_modal": [],
                        "opera_modal": [],
                        "prod_source": [],
                        "passageway": [],
                        "provice": [],
                        "city": [],
                        "sku_msg": [],
                        "point_location": []
                    },//筛选条件
                    "item": {
                        "main_index": {"sale_amount": 1},
                        "sale_amount": [1, 2]
                    }//主指标
                }//筛选条件的数据查询条件
            },
            methods: {
                //加载筛选条件
                setSelect: function () {
                    this.$http.post('http://'+this.IP+'/data-center/month/getScreenTerm?token='+userId,
                        {},
                        {emulateJSON: true})
                        .then(
                            function (res) {
                                console.log(res.data);
                                var data = res.data;
                                // this.year=data.year_month;
                                this.pay_modal = data.pay_modal;
                                this.pro_source = data.prod_source;
                                this.opera_modal = data.opera_modal;
                                this.spike = data.spike;
                                this.provCity = data.provice;
                                this.getAllCities = getCityes(this.provCity);
                                this.skuAll = data.sku_msg;
                                //console.log(this.getAllCities);
                            },
                            function (res) {
                                console.log(res.data);
                            });

                    //默认的请求
                    var modelSend = {
                        "model": 'recent_sales_board',
                        "condition": {"year_month": ''},
                        "item": {
                            "sale_amount": [1, 2],
                            "main_index": {"sale_amount": 1}//主指标
                        }//数据指标
                    };
                    console.log(modelSend);
                    this.dataContainer=decodeURI(getParamer('dataCondition'));//获取条件参数
                    console.log(this.dataContainer);
                    if(this.dataContainer=='undefined'){
                        this.selecShow=true;
                        this.backURL='../manageBoard/',
                            //如若存在条件，表示是从常用看板过来的，进行按条件绘制
                            modelSend.condition={"year_month": ''};
                    }
                    else{
                        this.selecShow=false;
                        this.backURL='../commonBoard/';
                        modelSend.condition=eval('(' + this.dataContainer + ')');
                    }
                    //销售看板
                    var yearSalesChart = new DRAWPRTAITCHART('http://'+this.IP+'/data-center/recentBorad/getRecentBoardInfo?token='+userId, modelSend, 'recentSell');
                    yearSalesChart.draw();

                },
                //根据省份展示城市
                showCity: function (proId, proName) {
                    this.proName = proName;//动态变化选择市中省份名字
                    this.proId = proId;
                    //console.log(proId);
                    //console.log(this.provCity);
                    for (var i = 0; i < this.provCity.length; i++) {
                        if (this.provCity[i].id == proId) {
                            this.provIdcity = this.provCity[i].city;
                        }
                    }
                },
                //获取选择的通路
                getSpike: function () {
                    this.getSpikeLabel.length = 0;
                    for (var i = 0; i < this.getSpikeId.length; i++) {
                        var id = this.getSpikeId[i];
                        for (var j = 0; j < this.spike.length; j++) {
                            var thisSpike = this.spike[j];
                            if (thisSpike.id == id) {
                                this.getSpikeLabel.push(thisSpike.label);
                            }
                        }
                    }
                    //选择的通路长度为14，大于14省略之后的
                    this.getSpikeStr = this.getSpikeLabel.join(",").length > 15 ? this.getSpikeLabel.join(",").substr(0, 15) + "..." : this.getSpikeLabel.join(",");
                },
                //获取选择的sku
                getSku: function () {
                    this.getSkuLabel.length = 0;
                    for (var i = 0; i < this.getSkuId.length; i++) {
                        var id = this.getSkuId[i];
                        for (var j = 0; j < this.skuAll.length; j++) {
                            var thisSpike = this.skuAll[j];
                            if (thisSpike.id == id) {
                                this.getSkuLabel.push(thisSpike.label);
                            }
                        }
                    }
                    //选择的通路长度为14，大于14省略之后的
                    this.getSkuStr = this.getSkuLabel.join(",").length > 15 ? this.getSkuLabel.join(",").substr(0, 15) + "..." : this.getSkuLabel.join(",");
                },
                //获取选择的省份
                getProv: function () {
                    var arr = [];
                    var selectPro = $("input[data-cacheval='false']");
                    //console.log(selectPro);
                    for (var i = 0; i < selectPro.length; i++) {
                        arr.push(selectPro[i].id);
                    }
                    this.getProviceId = arr;
                    var arrLabel = [];
                    for (var i = 0; i < arr.length; i++) {
                        for (var j = 0; j < this.provCity.length; j++) {
                            if (this.provCity[j].id == arr[i]) {
                                arrLabel.push(this.provCity[j].label);
                            }
                        }
                    }
                    this.getProviceLabel = arrLabel;
                    this.getProviceStr = this.getProviceLabel.join(",").length > 15 ? this.getProviceLabel.join(",").substr(0, 15) + "..." : this.getProviceLabel.join(",");

                },
                //获取选择的城市
                getselCity: function () {
                    //console.log(this.getAllCities);
                    //根据选中的城市id获取选中的城市label
                    var cityLabel = [];
                    for (var i = 0; i < this.getCityId.length; i++) {
                        for (var j = 0; j < this.getAllCities.length; j++) {
                            if (this.getAllCities[j].id == this.getCityId[i]) {
                                cityLabel.push(this.getAllCities[j].label);
                            }
                        }
                    }
                    this.getCityLabel = cityLabel;
                },
                //获取点位信息
                getPoint: function () {
                    console.log(this.getCityId);
                    var arr = this.getCityId;
                    var sendData = {"condition": {"city": arr}};
                    console.log(sendData);
                    this.$http.post('http://'+this.IP+'/data-center/month/getCityPoint?token='+userId,
                        {"paramData": JSON.stringify(sendData)},
                        {emulateJSON: true})
                        .then(
                            function (res) {
                                console.log(res.data);
                                this.getCityPoint = res.data.city_point;
                            },
                            function (res) {
                                console.log(res.data);
                            });
                },
                //获取选择的筛选条件并按条件绘图
                getSelect: function () {
                    //console.log("年："+this.getYear);
                    //console.log("月："+this.getMonth);
                    //console.log("支付方式："+this.getPayItem);
                    //console.log("运营模式："+this.getOperaItem);
                    //console.log("产品来源："+this.getProSourceItem);
                    //console.log("选中的通路："+this.getSpikeId);
                    //console.log("选中的省份:"+this.getProviceId);
                    //console.log("选中的城市:"+this.getCityId);

                    //根据获取的筛选条件请求数据

                    //this.modelSelect.condition.year_month=((this.getYear==0&&this.getMonth==0)?"":(this.getYear+"-"+this.getMonth));
                    this.modelSelect.condition.year_month = this.getYear;
                    this.modelSelect.condition.pay_modal = this.getPayItem;
                    this.modelSelect.condition.opera_modal = this.getOperaItem;
                    this.modelSelect.condition.prod_source = this.getProSourceItem;
                    //选中的通路
                    this.modelSelect.condition.passageway = this.getSpikeId;
                    this.modelSelect.condition.provice = this.getProviceId;
                    //选中的二级通路
                    var getTwo = document.querySelectorAll('[name="accTwoCheck"]:checked');
                    var arr = [];
                    for (var i = 0; i < getTwo.length; i++) {
                        arr.push(getTwo[i].getAttribute('id'));
                    }
                    this.modelSelect.condition.getTwospike = arr;
                    this.modelSelect.condition.city = this.getCityId;
                    this.modelSelect.condition.sku_msg = this.getSkuId;
                    this.modelSelect.condition.point_location = this.getPointId;
                    this.modelSelect.item = {"main_index": {}};
                    this.modelSelect.item.sale_amount = [1, 2];
                    this.modelSelect.item.main_index.sale_amount = 1;
                    var a = eval('(' + JSON.stringify(this.modelSelect) + ')');
                    //console.log(a);
                    //销售看板
                    var yearSalesChart = new DRAWPRTAITCHART('http://'+this.IP+'/data-center/recentBorad/getRecentBoardInfo?token='+userId, a, 'recentSell');
                    yearSalesChart.draw();
                    //第一个a的class为actice
                    $("#selMain li:first-child a").removeClass().addClass('ui-link ui-btn ui-btn-active');
                },
                //根据选择的主指标进行画图
                getMain: function (e) {
                    var mainTag = e.target.getAttribute('tag');
                    if (mainTag == "sale_amount") {
                        this.modelSelect.item = {"main_index": {}};
                        this.modelSelect.item.sale_amount = [1, 2];
                        this.modelSelect.item.main_index.sale_amount = 1;
                    }
                    else if (mainTag == "sku_sum") {
                        this.modelSelect.item = {"main_index": {}};
                        this.modelSelect.item.sku_sum = [1, 2];
                        this.modelSelect.item.main_index.sku_sum = 1;
                    }
                    else if (mainTag == "vender_sum") {
                        this.modelSelect.item = {"main_index": {}};
                        this.modelSelect.item.vender_sum = [1, 2];
                        this.modelSelect.item.main_index.vender_sum = 1;
                    }
                    if(this.dataContainer=='undefined'){
                        var a = eval('(' + JSON.stringify(this.modelSelect) + ')');
                        //console.log(a);
                        //销售看板
                        var yearSalesChart = new DRAWPRTAITCHART('http://'+this.IP+'/data-center/recentBorad/getRecentBoardInfo?token='+userId, a, 'recentSell');
                        yearSalesChart.draw();
                    }
                    else{
                        //如若存在条件，表示是从常用看板过来的，进行按条件绘制
                        this.modelSelect.condition=eval('(' + this.dataContainer + ')');
                        var a = eval('(' + JSON.stringify(this.modelSelect) + ')');
                        //console.log(a);
                        //销售看板
                        var yearSalesChart = new DRAWPRTAITCHART('http://'+this.IP+'/data-center/recentBorad/getRecentBoardInfo?token='+userId, a, 'recentSell');
                        yearSalesChart.draw();
                    }

                },
                cancelUsual:function(){
                    $("#myPopup").css("display","none");
                    $("#myPopup-screen").css("display","none");

                },
                usualShow:function(){
                    $("#myPopup").css("display","block");
                    $("#myPopup-screen").css("display","block");
                },
                addUsual:function(){
                    console.log(this.boardName);
                    this.modelSelect.condition.year_month = this.getYear;
                    this.modelSelect.condition.pay_modal = this.getPayItem;
                    this.modelSelect.condition.opera_modal = this.getOperaItem;
                    this.modelSelect.condition.prod_source = this.getProSourceItem;
                    //选中的通路
                    this.modelSelect.condition.passageway = this.getSpikeId;
                    this.modelSelect.condition.provice = this.getProviceId;
                    //选中的二级通路
                    var getTwo = document.querySelectorAll('[name="accTwoCheck"]:checked');
                    var arr = [];
                    for (var i = 0; i < getTwo.length; i++) {
                        arr.push(getTwo[i].getAttribute('id'));
                    }
                    this.modelSelect.condition.getTwospike = arr;
                    this.modelSelect.condition.city = this.getCityId;
                    this.modelSelect.condition.sku_msg = this.getSkuId;
                    this.modelSelect.condition.point_location = this.getPointId;
                    this.modelSelect.item = {"main_index": {}};
                    this.modelSelect.item.sale_amount = [1, 2];
                    this.modelSelect.item.main_index.sale_amount = 1;
                    this.modelSelect.condition.boardName=this.boardName;
                    var a = eval('(' + JSON.stringify(this.modelSelect) + ')');
                    console.log(a);
                    this.$http.post('http://'+this.IP+'/data-center/CommonBoard/getCommonBoardInfo?token='+userId,
                        {"paramData": JSON.stringify(a)},
                        {emulateJSON: true})
                        .then(
                            function (res) {
                                $("#myPopup").css("display","none");
                                $("#myPopup-screen").css("display","none");
                            },
                            function (res) {
                                alert("保存失败");
                            });
                }

            }
        });
        //默认执行页面
        vm.setSelect();
    }
)
//获取所有的城市
function getCityes(arrList){
    var arr=[];

    for(var i=0;i<arrList.length;i++){
        var pro=arrList[i].city;
        //console.log(pro);
        for(var j=0;j<pro.length;j++){
            var city=pro[j];
            arr.push(city);
        }
    }
    return arr;
}
//方法获取浏览器的url中的参数
function getParamer(paramer){
    var url=window.location.href.split("?")[1];
    if(url){
        if(url.indexOf("&")>0){
            var urlParamArry=url.split("&");
            for(var i=0; i<urlParamArry.length; i++){
                var paramerName=urlParamArry[i].split("=");
                if(paramer==paramerName[0]){
                    return paramerName[1];
                }
            }
        }else{
            var paramerValue=url.split("=")[1];
            return paramerValue;
        }
    }
}